<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/base.css"/>
		<link rel="stylesheet" type="text/css" href="css/zhuce.css"/>
		<script src="js/rem.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/api.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery-1.11.3.min.js"></script>
	</head>
	<body>
		<div class="container">
			<img src="img/状态栏_黑.png"  class="zhuangtai">
			<img src="img/logo.png" class="logo" >
			<p class="welcome">欢迎登陆ELLESHOP账户</p>
			<form action="" method="" class="forms">
				
				<div class="send">
					<span>+86</span><input type="text" name="" id="phone_num" value="" /><span class="yzm_send">发送验证码</span><br>
				</div>
				<input type="text" name="" id="iptyz" value="" placeholder="输入验证码"/><br>
				<input type="password" name="" id="psd" value="" placeholder="输入密码"/><br>
				<button type="button" id="btn">注册</button>
				<span id="tishi">
					
				</span>
			</form>
			<p class="huiyuan"><sapn class="yijing">已经是会员?</sapn><a href="denglu.html" >立即登录</a></p>
			<p class="agree">注册即表示同意用户协议</p>
		</div>
		
		<script type="text/javascript">
			let phone_num=document.querySelector('#phone_num')
			let psd=document.querySelector('#psd')
			let btn=document.querySelector('#btn')
			let tishi=document.querySelector('#tishi')
			let phone_Str=/^(13[0-9]|14[0-9]|15[0-9]|18[0-9]|17[0-9])\d{8}$/
			let r_now=document.querySelector('#r_now')
			let yzm_Str=/^\d{6}$/
			btn.onclick=function(){
				let phone=phone_num.value;
				let password=psd.value;
				let isPh=false;
				if(phone_Str.test(phone_num.value)){
					console.log('符合手机')
					isPh=true;
				}else{
					isPh=false;
					console.log('不符合手机')
				}
				let isYz=false;
				let Yz=document.querySelector('#iptyz')
				if(yzm_Str.test(Yz.value)){
					console.log('验证码格式正确')
					isYz=true
				}else{
					console.log('验证码不正确')
					isYz=false
				}
				let isPw=false
				let pw_Str=/^[a-z0-9A-Z]{6,16}$/
				if(pw_Str.test(psd.value)){
					console.log('密码格式正确')
					isPw=true
				}else{
					console.log('密码格式错误')
					isPw=false
				}
				
				
				
				let regAPI="http://106.13.115.175:8080/elleshop/user/register.do"
				if(phone_Str.test(phone_num.value)&&yzm_Str.test(Yz.value)&&pw_Str.test(psd.value)){
					$.post(regAPI,{
						phone:phone_num.value,
						password:psd.value,
						code: iptyz.value
					},(res)=>{
						console.log(res)
						if(res.code==0){
							alert(res.info)
							localStorage.setItem('phone',phone_num.value)
							localStorage.setItem('password',psd.value)
							location.href='denglu.html'
						}
					})
				}
			}
			 let yzmSend=document.querySelector('.yzm_send')
			 console.log(yzmSend)
			 yzmSend.onclick=function(){
				
				$.post(sendCodeApi,{
					phone:phone_num.value
				},(res)=>{
					console.log(res)
				})
				let startTime = new Date()
				startTime = startTime.setSeconds(startTime.getSeconds()+60)
				
				let timer = setInterval(function(){
					let time=new Date()
					let t = parseInt((startTime-time)/1000)
					
					if(t<10){
						t = '0'+t
					}
					yzmSend.innerHTML = `<em style="font-style:normal;color:red;">${t}s</em>后重新发送`
					
					
					console.log(t)
					if(t<=0){
						clearInterval(timer)
						yzmSend.innerHTML = `发送验证码`
					}
					
				},500)
			 }
		</script>
	</body>
</html>
